import React, { Component } from "react";
import { NavLink, Link } from "react-router-dom";
import List from "./list";
import Detail from "./detail";
// list.jsx
// detail.jsx

//需求：
// 有一个商品列表页面
// 每个商品有一个详情页面
// product/23242
// product/10000
class View extends Component {
  ifPage = (id) => {
    if (id) {
      return <Detail id={id} />;
    } else {
      return <List />;
    }
  };
  render() {
    // console.log(this.props);
    // console.log(this.props.match.params.id);
    // history
    // location
    // match
    return (
      <div>
        这是info页面
        <Link to="/product">产品</Link>
        <Link to="/about">about</Link>
        <NavLink exact to="/product">
          产品
        </NavLink>
        <NavLink to="/about">about</NavLink>
        <NavLink to="/info">info</NavLink>
        {this.ifPage(this.props.match.params.id)}
        footer
      </div>
    );
  }
}

export default View;
